var path = require('path');
var webpack = require('webpack');
/*
 extract-text-webpack-plugin插件，
 有了它就可以将你的样式提取到单独的css文件里
 */
var ExtractTextPlugin = require('extract-text-webpack-plugin');
/*
 html-webpack-plugin插件，webpack中生成HTML的插件，
 具体可以去这里查看https://www.npmjs.com/package/html-webpack-plugin
 */
var HtmlWebpackPlugin = require('html-webpack-plugin');
/*
 一个根据模式匹配获取文件列表的node模块。
 有关glob的详细用法可以在这里看到——https://github.com/isaacs/node-glob
 */
var glob = require('glob');

/*
 webpack插件
 */
var CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
var UglifyJsPlugin = webpack.optimize.UglifyJsPlugin;

//debug标示
const debug = process.env.NODE_ENV !== 'production';

//通过getEntry函数获取所有js脚本
var jsEntries = getEntry('./src/main/webapp/js/*.js');


// webpack 配置
var config = {
    // 入口文件
    entry: jsEntries,
    output: {
        path: path.join(__dirname, 'dist'), //输出目录的配置，模板、样式、脚本、图片等资源的路径配置都相对于它
        publicPath: '/dist/',                //模板、样式、脚本、图片等资源对应的server上的路径
        filename: 'js/[name].js',            //每个页面对应的主js的生成配置
        chunkFilename: 'js/[id].chunk.js?[chunkhash]'   //chunk生成的配置
    },
    module: {
        loaders: [
            {
              test: /\.css$/,
              exclude: /node_modules|bootstrap/,
              loader: ExtractTextPlugin.extract('css?minimize&-autoprefixer!postcss'),
            },
            // {
            //   test: /\.less$/,
            //   include: './src/main/webapp/less',
            //   loader: ExtractTextPlugin.extract('css?minimize&-autoprefixer!postcss!less'),
            // },
            {
              test: /\.js$/,
              include: './src/main/webapp/js',
              loader: 'babel-loader?presets[]=es2015-loose&cacheDirectory&plugins[]=transform-runtime',
            },

            {
              // 图片加载器，雷同file-loader，更适合图片，可以将较小的图片转成base64，减少http请求
              // 如下配置，将小于8192byte的图片转成base64码
              test: /\.(png|jpg|gif)$/,
              include: './src/main/webapp/images',
              loader: 'url?limit=8192&name=./images/[hash].[ext]',
            },
            {
              // 专供iconfont方案使用的，后面会带一串时间戳，需要特别匹配到
              test: /\.(woff|woff2|svg|eot|ttf)\??.*$/,
              include: './src/main/webapp/fonts',
              loader: 'file?name=static/fonts/[name].[ext]',
            },
        ]
    },
    plugins: [
        new CommonsChunkPlugin({
            name: 'vendors' // 将公共模块提取，生成名为`vendors`的chunk
        }),
        //单独使用link标签加载css并设置路径，相对于output配置中的publicPath
        new ExtractTextPlugin('css/[name].css'),
        debug ? function () {
        } : new UglifyJsPlugin({ //压缩代码
            compress: {
                warnings: false,
                drop_debugger: true,
                drop_console: true
            },
            except: ['$super', '$', 'exports', 'require', 'define', 'module'] //排除关键字
        })
    ],
    // //使用webpack-dev-server
    // devServer: {
    //     contentBase: './',
    //     host: 'localhost',
    //     port: 9090, //默认9090
    //     inline: true, //可以监控js变化
    //     hot: true //热启动
    // }
};

module.exports = config;


function getEntry(globPath) {
    //获取globPath路径下的所有文件
    var files = glob.sync(globPath);
    var entries = {},
        entry, dirname, basename, pathname, extname;
    //循环
    for (var i = 0; i < files.length; i++) {
        entry = files[i];
        dirname = path.dirname(entry);//返回路径的所在的文件夹名称
        extname = path.extname(entry);//返回指定文件名的扩展名称
        /**
         * path.basename(p, [ext])
         * 返回指定的文件名，返回结果可排除[ext]后缀字符串
         * path.basename('/foo/bar/baz/asdf/quux.html', '.html')=>quux
         */
        basename = path.basename(entry, extname);
        pathname = path.join(dirname, basename);//路径合并
        entries[basename] = entry;
    }
    //返回map=>{fileName:fileUrl}
    return entries;
}